<!DOCTYPE html>
<html>
<head>
<title>{{ the_title }}</title>
<style>
{
	background: #FF6633;
}
.h1{
	letter-spacing: 5px;
	font-color: #FF6633;
	text-align: center;
}

a {
  text-decoration:  none; 
  font-weight:      600; 
}
a:hover {
  text-decoration:  underline;
}

h2 {
  font-size:        150%;
}
table {
  margin-left:      20px;
  margin-right:     20px;
  caption-side:     bottom;
  border-collapse:  collapse;
}
td, th, p {
  padding:          10px;
  text-align:       left;
}
.copyright {
  font-size:        75%;
  font-style:       italic;
}
.slogan {
  font-size:        75%;
  font-style:       italic;
}
.confirmentry {
  font-weight:      600; 
}
.function{
	padding:10px 0; 
	overflow:hidden; 
	clear:both; 
	line-height:25px;
	padding:0px;

}
.layout{
	position: absolute;
	top: 140px;
	left: 500px;
}

/*** Tables ***/

table {
font-size:          1em;
background-color:   #fafcff;
border:             1px solid #909090;
color:              #2a2a2a;
padding:            5px 5px 2px;
border-collapse:    collapse;
}


/*** Inputs ***/
input[type=text] {
  font-size:        100%;
  width:            30em;
}

input[type=password] {
  font-size:        115%;
  width:            30em;
}

input[type=submit] {
  font-size:        125%;
}



.img4
{
	position: absolute;
	left:590px;
	top: 400px;

}
.img4 img
{
	width: 400px;
	height: 300px;
}

.r
{
	font-size: 20pt;

}
.title{
	position: absolute;
	top: 50px;
	left: 500px;
}
</style>
</head>
<body>
<h1> 个人FLASK网站</h1>
</div>
<div class="layout">
<table>
<p class='h1'>面部识别</p>
<form method="post" action="/face">
<div class="function">
<p>请放入图片链接<input type="text" name="face"></p>
<p class="r">分析结果:<label><b>{{r}}</b></label></p>
</div>
<button type="submit">submit</button>
</form>
</table>
</div>
<div class="img4">
<img src="{{img_url4}}">
<form method="get" action="viewlog">
<button type="submit">查看日志</button>
</form>
</body>
</html>